<template>
  <div id="app" class="app-container">
    <Navbar/>
    <main class="content">
      <router-view/>
    </main>
  </div>
  1
    <Footer/>

</template>

<script>
import Navbar from './components/Navbar.vue';
import Footer from './components/Footer.vue';
import Blog from './components/views/Blog.vue';
export default {
  components: {
    Navbar,
    Footer,
    Blog
  }
}
</script>

<style scoped>
.app-container {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

.content {
  flex: 1;
  overflow-y: auto; 
}

.Footer {
  width: 100%;
  position: relative;}
</style>